<template lang='pug'>
.big_alert(v-if="isshow")
  .new_float
    a.alert_close_btn(href="javascript:;",@click="close")
    a(:href="data.linkUrl")
      img(:src="data.picUrl | imgUrl", alt="",@error="error")
</template>
<script>
import { mapState } from 'vuex'
export default {
  props: ['cdata'],
  methods: {
    close() {
      this.isshow = false;
    },
    error(e) {
      e.target.src = "/static/images/pro-default.png"
    }
  },
  computed: {
    data() {
      return this.cdata[0].tag[0]
    },
    isshow () {
      return this.$store.state.showNewFloat
    }
  }
}
</script>
<style lang='scss' scoped>
@import './tool.scss';
.big_alert {
    // display: none;
    width: toRem(750);
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, .5);
    z-index: 1000;
    text-align: center;
    .alert_close_btn {
        display: block;
        position: absolute;
        width: toRem(68);
        height: toRem(68);
        top: toRem(90);
        right: toRem(30);
        background-image: url(../images/apptip-close.png);
        background-size: 100% 100%;
    }
    // .alertbtn {
    //     display: block;
    //     border-radius: toRem(20);
    //     width: toRem(400);
    //     height: toRem(88);
    //     background-color: #f6c64c;
    //     color: #fff;
    //     line-height: toRem(88);
    //     text-align: center;
    //     font-size: toRem(34);
    //     margin: 0 auto; 
    // }
    img {
        margin-top: toRem(340);
        width: toRem(648);
        height: toRem(577);
    }
}
</style>